﻿<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"       
    xmlns:local="clr-namespace:SLEffectHarness"
    xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows" 
    xmlns:System="clr-namespace:System;assembly=mscorlib" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" x:Class="SLEffectHarness.MainPage"
    mc:Ignorable="d"                                                 
    xmlns:themingToolkit="clr-namespace:System.Windows.Controls.Theming;assembly=System.Windows.Controls.Theming.Toolkit"
    xmlns:ctls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" d:DesignHeight="266" d:DesignWidth="821"
    xmlns:watch="clr-namespace:Synergist.BallWatch" 
      >
  <UserControl.Resources>
    <ResourceDictionary  > 
      <ResourceDictionary.MergedDictionaries> 
        <ResourceDictionary Source="TemplatesToConfigureEffects.xaml" />
        <ResourceDictionary Source="ContentTemplates.xaml" />
       
        
  
      </ResourceDictionary.MergedDictionaries>

      <local:Bool2VisibilityConverter x:Key="Bool2VisibilityConverter" /> 
      <Color x:Key="CheckBoxFillColor">#F4F4F4</Color>

      
      
  	
    	<Style x:Key="CheckBoxStyle1" TargetType="CheckBox">
    		<Setter Property="Background" Value="#FF448DCA"/>
    		<Setter Property="Foreground" Value="#FF000000"/>
    		<Setter Property="HorizontalContentAlignment" Value="Left"/>
    		<Setter Property="VerticalContentAlignment" Value="Top"/>
    		<Setter Property="Padding" Value="4,1,0,0"/>
    		<Setter Property="BorderThickness" Value="1"/>
    		<Setter Property="BorderBrush">
    			<Setter.Value>
    				<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
    					<GradientStop Color="#FFA3AEB9" Offset="0"/>
    					<GradientStop Color="#FF8399A9" Offset="0.375"/>
    					<GradientStop Color="#FF718597" Offset="0.375"/>
    					<GradientStop Color="#FF617584" Offset="1"/>
    				</LinearGradientBrush>
    			</Setter.Value>
    		</Setter>
    		<Setter Property="Template">
    			<Setter.Value>
    				<ControlTemplate TargetType="CheckBox">
    					<Grid>
    						<Grid.ColumnDefinitions>
    							<ColumnDefinition Width="*"/>
    							<ColumnDefinition Width="20"/>
    						</Grid.ColumnDefinitions>
    						<vsm:VisualStateManager.VisualStateGroups>
    							<vsm:VisualStateGroup x:Name="CommonStates">
    								<vsm:VisualState x:Name="Normal"/>
    								<vsm:VisualState x:Name="MouseOver">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="BackgroundOverlay" Storyboard.TargetProperty="Opacity">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddleBackground" Storyboard.TargetProperty="Opacity">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    								<vsm:VisualState x:Name="Pressed">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="BackgroundOverlay" Storyboard.TargetProperty="Opacity">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddleBackground" Storyboard.TargetProperty="Opacity">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    										<ColorAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddle" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[3].(GradientStop.Color)">
    											<SplineColorKeyFrame KeyTime="0" Value="#FF6DBDD1"/>
    										</ColorAnimationUsingKeyFrames>
    										<ColorAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddle" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
    											<SplineColorKeyFrame KeyTime="0" Value="#FF6DBDD1"/>
    										</ColorAnimationUsingKeyFrames>
    										<ColorAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddle" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
    											<SplineColorKeyFrame KeyTime="0" Value="#FF6DBDD1"/>
    										</ColorAnimationUsingKeyFrames>
    										<ColorAnimationUsingKeyFrames Storyboard.TargetName="BoxMiddle" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[2].(GradientStop.Color)">
    											<SplineColorKeyFrame KeyTime="0" Value="#FF6DBDD1"/>
    										</ColorAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    								<vsm:VisualState x:Name="Disabled">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="(UIElement.Opacity)">
    											<SplineDoubleKeyFrame KeyTime="0" Value=".55"/>
    										</DoubleAnimationUsingKeyFrames>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)">
    											<SplineDoubleKeyFrame KeyTime="0" Value="0.55"/>
    										</DoubleAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    							</vsm:VisualStateGroup>
    							<vsm:VisualStateGroup x:Name="CheckStates">
    								<vsm:VisualState x:Name="Checked">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="CheckIcon" Storyboard.TargetProperty="(UIElement.Opacity)">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    								<vsm:VisualState x:Name="Unchecked"/>
    								<vsm:VisualState x:Name="Indeterminate">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="IndeterminateIcon" Storyboard.TargetProperty="(UIElement.Opacity)">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    							</vsm:VisualStateGroup>
    							<vsm:VisualStateGroup x:Name="FocusStates">
    								<vsm:VisualState x:Name="Focused">
    									<Storyboard>
    										<DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentFocusVisualElement" Storyboard.TargetProperty="Opacity">
    											<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
    										</DoubleAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    								<vsm:VisualState x:Name="Unfocused"/>
    							</vsm:VisualStateGroup>
    							<vsm:VisualStateGroup x:Name="ValidationStates">
    								<vsm:VisualState x:Name="Valid"/>
    								<vsm:VisualState x:Name="InvalidUnfocused">
    									<Storyboard>
    										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationErrorElement" Storyboard.TargetProperty="Visibility">
    											<DiscreteObjectKeyFrame KeyTime="0">
    												<DiscreteObjectKeyFrame.Value>
    													<Visibility>Visible</Visibility>
    												</DiscreteObjectKeyFrame.Value>
    											</DiscreteObjectKeyFrame>
    										</ObjectAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    								<vsm:VisualState x:Name="InvalidFocused">
    									<Storyboard>
    										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationErrorElement" Storyboard.TargetProperty="Visibility">
    											<DiscreteObjectKeyFrame KeyTime="0">
    												<DiscreteObjectKeyFrame.Value>
    													<Visibility>Visible</Visibility>
    												</DiscreteObjectKeyFrame.Value>
    											</DiscreteObjectKeyFrame>
    										</ObjectAnimationUsingKeyFrames>
    										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="validationTooltip" Storyboard.TargetProperty="IsOpen">
    											<DiscreteObjectKeyFrame KeyTime="0">
    												<DiscreteObjectKeyFrame.Value>
    													<System:Boolean>True</System:Boolean>
    												</DiscreteObjectKeyFrame.Value>
    											</DiscreteObjectKeyFrame>
    										</ObjectAnimationUsingKeyFrames>
    									</Storyboard>
    								</vsm:VisualState>
    							</vsm:VisualStateGroup>
    						</vsm:VisualStateManager.VisualStateGroups>
    						<Grid HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="1">
    							<Rectangle x:Name="Background" Fill="#FFFFFFFF" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}" RadiusX="1" RadiusY="1" Height="18" Margin="1" Width="18"/>
    							<Rectangle x:Name="BackgroundOverlay" Fill="#FFC4DBEE" Stroke="#00000000" StrokeThickness="1" RadiusX="1" RadiusY="1" Height="14" Margin="1" Width="14" Opacity="0" d:IsHidden="True"/>
    							<Rectangle x:Name="BoxMiddleBackground" Fill="{TemplateBinding Background}" Stroke="#00000000" StrokeThickness="1" RadiusX="1" RadiusY="1" Height="10" Width="10"/>
    							<Rectangle x:Name="BoxMiddle" StrokeThickness="1" RadiusX="1" RadiusY="1" Height="14" Width="14" Fill="{StaticResource CheckIconBrush}">
    								<!-- <Rectangle.Fill>
    									<LinearGradientBrush EndPoint="0.64,0.88" StartPoint="0.62,0.15">
    										<GradientStop Color="#FFFFFFFF" Offset="0.013"/>
    										<GradientStop Color="#F9FFFFFF" Offset="0.375"/>
    										<GradientStop Color="#EAFFFFFF" Offset="0.603"/>
    										<GradientStop Color="#D8FFFFFF" Offset="1"/>
    									</LinearGradientBrush>
    								</Rectangle.Fill> --> 
    								<Rectangle.Stroke>
    									<LinearGradientBrush EndPoint=".5,1" StartPoint=".5,0">
    										<GradientStop Color="#FFFFFFFF" Offset="1"/>
    										<GradientStop Color="#FFFFFFFF" Offset="0"/>
    										<GradientStop Color="#FFFFFFFF" Offset="0.375"/>
    										<GradientStop Color="#FFFFFFFF" Offset="0.375"/>
    									</LinearGradientBrush>
    								</Rectangle.Stroke>
    							</Rectangle>
    							<Rectangle x:Name="BoxMiddleLine" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="1" RadiusX="1" RadiusY="1" Height="14" Width="14" Opacity=".2"/>
    							<Path x:Name="CheckIcon" Fill="#FF333333" Stretch="Fill" Height="10" Margin="1,1,0,1.5" Width="10.5" Opacity="0" Data="M102.03442,598.79645 L105.22962,597.78918 L106.78825,600.42358 C106.78825,600.42358 108.51028,595.74304 110.21724,593.60419 C112.00967,591.35822 114.89314,591.42316 114.89314,591.42316 C114.89314,591.42316 112.67844,593.42645 111.93174,594.44464 C110.7449,596.06293 107.15683,604.13837 107.15683,604.13837 z"/>
    							<Rectangle x:Name="IndeterminateIcon" Fill="#FF333333" Height="2" Width="6" Opacity="0"/>
    							<Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" RadiusX="1" RadiusY="1" Height="14" Width="14" Opacity="0"/>
    							<Rectangle x:Name="ContentFocusVisualElement" Stroke="#FF6DBDD1" StrokeThickness="1" RadiusX="2" RadiusY="2" Height="16" Width="16" IsHitTestVisible="false" Opacity="0"/>
    							<Border x:Name="ValidationErrorElement" Margin="1" Visibility="Collapsed" BorderBrush="#FFDB000C" BorderThickness="1" CornerRadius="1" ToolTipService.PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}">
    								<ToolTipService.ToolTip>
    									<ToolTip x:Name="validationTooltip" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Template="{StaticResource ValidationToolTipTemplate}" Placement="Right" PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}">
    										<ToolTip.Triggers>
    											<EventTrigger RoutedEvent="Canvas.Loaded">
    												<BeginStoryboard>
    													<Storyboard>
    														<ObjectAnimationUsingKeyFrames Storyboard.TargetName="validationTooltip" Storyboard.TargetProperty="IsHitTestVisible">
    															<DiscreteObjectKeyFrame KeyTime="0">
    																<DiscreteObjectKeyFrame.Value>
    																	<System:Boolean>true</System:Boolean>
    																</DiscreteObjectKeyFrame.Value>
    															</DiscreteObjectKeyFrame>
    														</ObjectAnimationUsingKeyFrames>
    													</Storyboard>
    												</BeginStoryboard>
    											</EventTrigger>
    										</ToolTip.Triggers>
    									</ToolTip>
    								</ToolTipService.ToolTip>
    								<Grid Height="10" HorizontalAlignment="Right" Margin="0,-4,-4,0" VerticalAlignment="Top" Width="10" Background="Transparent">
    									<Path Fill="#FFDC000C" Margin="0,3,0,0" Data="M 1,0 L5,0 A 2,2 90 0 1 7,2 L7,6 z"/>
    									<Path Fill="#ffffff" Margin="0,3,0,0" Data="M 0,0 L2,0 L 7,5 L7,7"/>
    								</Grid>
    							</Border>
    						</Grid>
    						<ContentPresenter x:Name="contentPresenter" Margin="{TemplateBinding Padding}" Grid.Column="0" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" HorizontalAlignment="Left" VerticalAlignment="Center"/>
    					</Grid>
    				</ControlTemplate>
    			</Setter.Value>
    		</Setter>
    	</Style>
    	

  


      <DataTemplate x:Key="DataTemplateEffect">
        <ctls:Expander HorizontalAlignment="Left" VerticalAlignment="Top" 
				MinWidth="250"  BorderThickness="2,1,2,1" 
				  Style="{StaticResource ExpanderStyle}" IsExpanded="{Binding IsChecked, Mode=TwoWay}"
				 >
        	<ctls:Expander.Resources>
        		<Storyboard x:Name="Storyboard1"/>
        	</ctls:Expander.Resources>
          <ctls:Expander.Header>
            <TextBlock Text="{Binding Path=DisplayName}" FontSize="16" Foreground="{StaticResource NormalBrush}" FontWeight="Bold" >
            <!--<CheckBox Content="{Binding Path=DisplayName}" IsChecked="{Binding Path=IsChecked, Mode=TwoWay}" 
                      HorizontalAlignment="Stretch" MinWidth="250" 
                      Style="{StaticResource CheckBoxStyle1}">-->
              <ToolTipService.ToolTip>
                <ToolTip>
                  <TextBlock Text="Click this checkbox to enalble the effect" /> 

                </ToolTip>
              </ToolTipService.ToolTip>

            </TextBlock>
          </ctls:Expander.Header>
          <Grid >
            <ContentControl Content="{Binding Path=Effect}" local:DataTemplateSetterBehavior.TemplateName="{Binding Path=DisplayName}"/>
          </Grid>
        </ctls:Expander>
      </DataTemplate>
      <Style x:Key="ToggleButtonStyle1" TargetType="ToggleButton">
      	<Setter Property="Background" Value="#FF1F3B53"/>
      	<Setter Property="Foreground" Value="#FF000000"/>
      	<Setter Property="Padding" Value="3"/>
      	<Setter Property="BorderThickness" Value="1"/>
      	<Setter Property="BorderBrush">
      		<Setter.Value>
      			<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
      				<GradientStop Color="#FFA3AEB9" Offset="0"/>
      				<GradientStop Color="#FF8399A9" Offset="0.375"/>
      				<GradientStop Color="#FF718597" Offset="0.375"/>
      				<GradientStop Color="#FF617584" Offset="1"/>
      			</LinearGradientBrush>
      		</Setter.Value>
      	</Setter>
      	<Setter Property="Template">
      		<Setter.Value>
      			<ControlTemplate TargetType="ToggleButton">
      				<Grid>
      					<vsm:VisualStateManager.VisualStateGroups>
      						<vsm:VisualStateGroup x:Name="CommonStates">
      							<vsm:VisualState x:Name="Normal"/>
      							<vsm:VisualState x:Name="MouseOver">
      								<Storyboard d:ShouldSerialize="False"/>
      							</vsm:VisualState>
      							<vsm:VisualState x:Name="Pressed">
      								<Storyboard d:ShouldSerialize="False"/>
      							</vsm:VisualState>
      							<vsm:VisualState x:Name="Disabled">
      								<Storyboard>
      									<DoubleAnimationUsingKeyFrames Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity">
      										<SplineDoubleKeyFrame KeyTime="0" Value=".55"/>
      									</DoubleAnimationUsingKeyFrames>
      								</Storyboard>
      							</vsm:VisualState>
      						</vsm:VisualStateGroup>
      						<vsm:VisualStateGroup x:Name="CheckStates">
      							<vsm:VisualState x:Name="Checked">
      								<Storyboard d:ShouldSerialize="False"/>
      							</vsm:VisualState>
      							<vsm:VisualState x:Name="Unchecked">
      								<Storyboard>
      									<ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="path" Storyboard.TargetProperty="(UIElement.Visibility)">
      										<DiscreteObjectKeyFrame KeyTime="00:00:00">
      											<DiscreteObjectKeyFrame.Value>
      												<Visibility>Collapsed</Visibility>
      											</DiscreteObjectKeyFrame.Value>
      										</DiscreteObjectKeyFrame>
      									</ObjectAnimationUsingKeyFrames>
      								</Storyboard>
      							</vsm:VisualState>
      						</vsm:VisualStateGroup>
      						<vsm:VisualStateGroup x:Name="FocusStates">
      							<vsm:VisualState x:Name="Focused">
      								<Storyboard>
      									<DoubleAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity">
      										<SplineDoubleKeyFrame KeyTime="0" Value="1"/>
      									</DoubleAnimationUsingKeyFrames>
      								</Storyboard>
      							</vsm:VisualState>
      							<vsm:VisualState x:Name="Unfocused"/>
      						</vsm:VisualStateGroup>
      					</vsm:VisualStateManager.VisualStateGroups>
      					<ctls:Viewbox Margin="0,0,-80,-85" Content="Viewbox">
      						<Border x:Name="Background" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3" Margin="0,0,2,-1">      						
      							<Canvas Width="20" Height="12" >
      								<Ellipse Width="9.7473" Height="7.14665" Canvas.Left="5" Canvas.Top="1" Stretch="Fill" StrokeLineJoin="Round" Stroke="{StaticResource NormalBrush}" Fill="{StaticResource CheckIconBrush}"/>
      								<Path x:Name="path" Width="18.875" Height="10.6721" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" StrokeThickness="2" StrokeLineJoin="Round" Stroke="{StaticResource NormalBrush}" Data="M 3.14045,7.38062C 5.77972,5.18919 8.42336,3.04621 11.2564,3C 14.0462,2.95449 17.0196,4.94213 20,7.00711L 19.9615,7.2587C 16.8622,9.49866 13.9094,11.7734 10.9242,11.6678C 8.2555,11.5733 5.68352,9.67861 3.125,7.53334L 3.14045,7.38062 Z "/>
      							</Canvas>

      						</Border>
      					</ctls:Viewbox>
      					<Rectangle x:Name="DisabledVisualElement" Fill="#FFFFFFFF" RadiusX="3" RadiusY="3" IsHitTestVisible="false" Opacity="0" d:IsHidden="True"/>
      					<Rectangle x:Name="FocusVisualElement" Stroke="#FF6DBDD1" StrokeThickness="1" RadiusX="2" RadiusY="2" Margin="1" IsHitTestVisible="false" Opacity="0" d:IsHidden="True"/>
      				</Grid>
      			</ControlTemplate>
      		</Setter.Value>
      	</Setter>
      </Style>

      <Style x:Key="WhiteHeaderStyle" TargetType="TextBlock">
        <Setter Property="Foreground" Value="White" /> 
        <Setter Property="FontSize" Value="20" />          
        <Setter Property="VerticalAlignment" Value="Center" /> 
      </Style>
    </ResourceDictionary>
  </UserControl.Resources>
   <Grid x:Name="LayoutRoot"  Margin="0,0,0,0" Background="#FF0A3E69" >

    <Grid x:Name="TransitionsPlaceHolder" Visibility="Collapsed">
      <local:TransitionsSample VerticalAlignment="Stretch" HorizontalAlignment="Stretch" x:Name="transition"/>      
    </Grid>
     
    <Grid x:Name="EffectsPlaceHolder"> 
    <Grid.RowDefinitions>
      <RowDefinition Height="30" /> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="20" /> 
      
    </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
      <ColumnDefinition Width="318" />
      <ColumnDefinition Width="*" />

    </Grid.ColumnDefinitions>
     
    <TextBlock Text="Effect to Apply:" Grid.Row="0" Grid.Column="0" Style="{StaticResource WhiteHeaderStyle}" Margin="5,0,0,0"/>  
    
    <StackPanel Grid.Column="1" Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Left" Margin="10,0,0,0">
        <TextBlock Text="Type of content:" Style="{StaticResource WhiteHeaderStyle}" Grid.Column="1"/>
      <CheckBox  Margin="10,0,0,0" x:Name="ShowVectors" Style="{StaticResource CheckBoxStyle1}" Width="105">
        <TextBlock Text="Vectors" Style="{StaticResource WhiteHeaderStyle}" />         
      </CheckBox>
      <CheckBox Margin="10,0,0,0" x:Name="ShowRaster" Style="{StaticResource CheckBoxStyle1}" Width="95" IsChecked="True">
        <TextBlock Text="Image" Style="{StaticResource WhiteHeaderStyle}" />
      </CheckBox>
    </StackPanel>
 
    <ListBox x:Name="effectsList"   ItemsSource="{Binding Effects}"  Grid.Row="1"
             HorizontalAlignment="Stretch" Margin="0,0,10,0" MaxWidth="400" Grid.Column="0" Grid.RowSpan="2" 
             ItemTemplate="{StaticResource DataTemplateEffect}" 
          Style="{StaticResource ListBoxStyle}" />
    <Border x:Name="ParentPlaceHolder" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Grid.Column="1" Grid.Row="1" > 
      <Grid x:Name="ContentPlaceHolder"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
      	<Image  HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" Grid.ColumnSpan="1" Source="WebsiteNamedDesire.png" Stretch="UniformToFill" Visibility="{Binding ElementName=ShowRaster, Path=IsChecked, Converter={StaticResource Bool2VisibilityConverter}}" />
        <watch:TrainmasterCannonball HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" Visibility="{Binding ElementName=ShowVectors, Path=IsChecked, Converter={StaticResource Bool2VisibilityConverter}}" /> 
      </Grid>
    </Border>  
  </Grid>

    <Button x:Name="btnStop" Content="Start Transitions" Click="OnToggleTransitionsClick"  
              VerticalAlignment="Top" HorizontalAlignment="Right" Width="100" Height="20"></Button>

  
   </Grid>
</UserControl>
